var Contact = Backbone.Model.extend({
});

var ContactList = Backbone.Collection.extend({
    model: Contact
});

var myContacts = new ContactList([
    {
        "userId": "rirani",
        "jobTitleName": "Developer",
        "firstName": "Romin",
        "lastName": "Irani",
        "preferredFullName": "Romin Irani",
        "employeeCode": "E1",
        "region": "CA",
        "phoneNumber": "408-1234567",
        "emailAddress": "romin.k.irani@gmail.com"
    },
    {
        "userId": "nirani",
        "jobTitleName": "Developer",
        "firstName": "Neil",
        "lastName": "Irani",
        "preferredFullName": "Neil Irani",
        "employeeCode": "E2",
        "region": "CA",
        "phoneNumber": "408-1111111",
        "emailAddress": "neilrirani@gmail.com"
    },
    {
        "userId": "thanks",
        "jobTitleName": "Program Directory",
        "firstName": "Tom",
        "lastName": "Hanks",
        "preferredFullName": "Tom Hanks",
        "employeeCode": "E3",
        "region": "CA",
        "phoneNumber": "408-2222222",
        "emailAddress": "tomhanks@gmail.com"
    }
]);


var contactsView = Backbone.View.extend({
    initialize: function () {
        this.render();
    },
    template: _.template($('#contact-list').html()),
    render: function () {
        this.$el.append(this.template({'contacts': this.collection.toJSON()}));
        return this;
    }
});

new contactsView({
    collection: myContacts,
    el: 'ul'
});

var Router = Backbone.Router.extend({
    routes: {
        'userid/:userid': 'showDetails'
    },
    showDetails: function (userid) {
        this.contact = myContacts.findWhere({userId: userid});
        this.template = _.template($('#contact-details').html());
        $('section').html(this.template({'contact': this.contact.toJSON()}));
    }
});

var router = new Router();

Backbone.history.start();











